/* 初始化 */
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td { margin:0; padding:0; } 
body, button, input, select, textarea { font:12px/1.5tahoma, arial, \5b8b\4f53; } 
h1, h2, h3, h4, h5, h6{ font-size:100%; } 
address, cite, dfn, em, var { font-style:normal; } 
code, kbd, pre, samp { font-family:couriernew, courier, monospace; } 
small{ font-size:12px; } 
ul, ol { list-style:none; } 
a { text-decoration:none;transition: all .2s; } 
a:hover { text-decoration:none; } 
sup { vertical-align:text-top; } 
sub{ vertical-align:text-bottom; } 
legend { color:#000; } 
fieldset, img { border:0; } 
button, input, select, textarea { font-size:100%; } 
table { border-collapse:collapse; border-spacing:0; }



/* 头部区域 */
.navbar-mznav {
    background-color:white;
    border-color: #e7e7e7;
    padding: 5px 0;
    z-index: 999;
    
  }
  .navbar-mznav .navbar-brand {
    color: rgba(red, green, blue, .4);
    font-size: 24px;
  }
  .navbar-mznav .navbar-brand{
      height: 60px;
      line-height: 30px;
  }
  .navbar-mznav .navbar-brand:hover,
  .navbar-mznav .navbar-brand:focus {
    
    color: #40D2B1;
    background-color: transparent;
  }
  .navbar-mznav .navbar-text {
    color: #777;
  }
  .navbar-mznav .navbar-nav > li > a {
    color: #777;
    height: 60px;
    line-height: 30px;
    font-size: 16px;
    font-weight: 600;
  }
  .navbar-mznav .navbar-nav > li > a:hover,
  .navbar-mznav .navbar-nav > li > a:focus {
    color: #333;
    background-color: transparent;
    border-bottom: 2px solid #40D2B1;
  }
  .navbar-mznav .navbar-nav > .active > a,
  .navbar-mznav .navbar-nav > .active > a:hover,
  .navbar-mznav .navbar-nav > .active > a:focus {
    color: #555;
    border-bottom: 2px solid #40D2B1;
    
  }
  .navbar-mznav .navbar-nav > .disabled > a,
  .navbar-mznav .navbar-nav > .disabled > a:hover,
  .navbar-mznav .navbar-nav > .disabled > a:focus {
    color: #ccc;
    background-color: transparent;
  }
  .navbar-mznav .navbar-toggle {
    border-color: #ddd;
  }
  .navbar-mznav .navbar-toggle:hover,
  .navbar-mznav .navbar-toggle:focus {
    background-color: #ddd;
  }
  .navbar-mznav .navbar-toggle .icon-bar {
    background-color: #888;
  }
  .navbar-mznav .navbar-collapse,
  .navbar-mznav .navbar-form {
    border-color: #e7e7e7;
  }
  .navbar-mznav .navbar-nav > .open > a,
  .navbar-mznav .navbar-nav > .open > a:hover,
  .navbar-mznav .navbar-nav > .open > a:focus {
    color: #555;
    background-color: #e7e7e7;
  }


  /* home */
#home{
    margin-top: 70px;
    text-align: center;
    
    width: 100%;
    background-image: url(../images/home-bg.jpg);
    background-size: cover;
    position: relative;
    color: white
}
#home .lvjing{
    background-color: rgba(0, 0, 0, .5);
    width: 100%;
    height: 100%;
    padding: 90px 0;
}
#home h1.title{
    font-size: 36px;
    font-weight: bold;
}
#home .row{
    width: 100%;
    overflow: hidden;

}
#home .content{
    margin-top: 50px;
    font-size: 14px;
    line-height: 25px;
}
#home img{
    margin-top: 50px;
}
@media (max-width:768px){
    #home .row{
        margin: 0;
        padding: 0;
    }
    .lvjing{
        margin: 0;
    }
    #home img{
        margin-top: 30px;
        height: 180px;
        width: 350px;
    }
    #home h1.title{
        font-size: 24px;
        font-weight: bold;
    }
    #home .lvjing{
        
        padding: 50px 0;
    }
    #home .content{
        margin-top: 30px;
        font-size: 12px;
        line-height: 25px;
    }
    
}
#home .row.bounceIn{
    -webkit-animation-duration: 1s;
    -webkit-animation-delay: 1s;
    /* -webkit-animation-iteration-count: 2; */
}
/* bbs */
#bbs{
    padding: 70px 0;
    text-align: center;
    
}
#bbs .col-md-4{
    padding: 10px;
    transition: all .3s;
}
#bbs .col-md-4:hover{
    background-color:#ddd;
    border-radius: 5px;
}
#bbs a{
    color: #000;
}
#bbs img{
    margin-bottom:20px; 
}
#bbs h3{
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 20px;
}
@media (max-width:768px){
    #bbs{
        padding: 40px;
    }
    #bbs .col-md-4{
        padding: 15px;
    }
}
/* 前端开发 */
#web{
    background-color: rgb(248, 248, 248);
    padding: 100px 0;
}
#web h3{
    font-size: 30px;
    font-weight: 600;
}
#web p{
    margin-top: 15px;
    font-size: 14px;
}
#web p i{
    color: cadetblue;
    font-size: 40px;
    vertical-align: middle;
    margin-right: 15px;

}
@media (max-width:768px){
    #web{
        text-align: center;
        padding: 50px 0;
    }
    #web img{
        width: 380px;
        margin-top: 30px;
    }
    #web p{
        margin-top: 5px;
    }
    #web p i{
        font-size: 30px;
        text-align: left;
    }
    #web h3{
        margin-bottom: 20px;
    }
}
/* bs */
#bs{
    background-color:white;
    padding: 100px 0;
}
#bs h3{
    font-size: 30px;
    font-weight: 600;
}
#bs p{
    margin-top: 15px;
    font-size: 14px;
}
#bs p i{
    color: cadetblue;
    font-size: 40px;
    vertical-align: middle;
    margin-right: 15px;

}
@media (max-width:768px){
    #bs{
        text-align: center;
        padding: 50px 0;
    }
    #bs img{
        width: 380px;
        /* margin-top: 10px; */
    }
    #bs p{
        margin-top: 5px;
    }
    #bs p i{
        font-size: 30px;
        text-align: left;
    }
    #bs h3{
        margin:30px 0;
    }
}
#course{
    padding: 80px 0;
    text-align: center;
    background-color: rgb(248, 248, 248);
    
}
#course .col-md-3{
    overflow: hidden;
}
#course .course{
    background-color: white;
    margin-bottom: 30px;
}
#course .course img{
    width: 260px;
    margin: 0 auto;
}
#course h3{
    font-size: 30px;
    font-weight: 500;
    margin-bottom: 40px;
}
#course a{
    margin: 30px;
    padding: 6px 20px;
    border-radius: 0;
    border: 1px solid #40D2B1;
    transition: all .4s;
}
#course a:hover{
    background-color: aquamarine;
}
@media (max-width:768px){
    #course .course{
        width: 260px;
        margin-left: 70px;
    }
}
/* app */
#app{
    background-color: white;
    padding: 100px 0;
}
#app h3{
    font-size: 30px;
    font-weight: 600;
}
#app p{
    margin-top: 15px;
    font-size: 14px;
}
#app p i{
    color: cadetblue;
    font-size: 40px;
    vertical-align: middle;
    margin-right: 15px;

}
@media (max-width:768px){
    #app{
        text-align: center;
        padding: 50px 0;
    }
    #app img{
        width: 380px;
        height: 200px;
        margin-top: 30px;
    }
    #app p{
        margin-top: 5px;
    }
    #app h3{
        margin-bottom: 20px;
    }
}
#app .download{
    margin-top: 50px;
}
#app .download span{
    padding: 6px 30px;
    margin-right: 15px;
    background-color: transparent;
    border-radius: 0;
    border: 1px solid #40D2B1;
    transition: all .4s;

}
#app .download span:hover{
    background-color:greenyellow;
}
/* 联系我们 */
#contact{
    background-image: url('../images/contact-bg.png');
    background-size: cover;
    color: white;
    
}
#contact .lvjing{
    background-color: rgba(0, 0, 0, .6);
    padding: 80px 0;
}
#contact h3{
    font-size: 30px;
    font-weight: 500;
}
#contact p{
    margin-top: 20px;
}
#contact .col-md-6 div{
    margin-top: 25px;
}
#contact .col-md-6 div i{
    margin-right: 15px;
}
/* 脚注部分 */
#footer{
    padding: 25px;
    text-align: center;
}
